<template>
  <div>
    <el-form ref="form" label-width="100px" :model="form" :rules="rules" class="form-width-80">
      <el-form-item label="昵称:" prop="name" v-if="model=='admin'">
        <el-input v-model="form.name" placeholder="请输入昵称" />
      </el-form-item>
      <el-form-item label="昵称:" prop="nickname" v-else>
        <el-input v-model="form.nickname" placeholder="请输入昵称" />
      </el-form-item>
      <el-form-item label="权限组:" prop="title" v-if="form.role!=undefined&&model=='admin'">
        <el-input v-model="form.role.title" placeholder="" disabled/>
      </el-form-item>
      <el-form-item label="我的店铺:" prop="title" v-else>
        <el-input v-model="form.shop.title" placeholder="" disabled/>
      </el-form-item>
       <el-form-item prop="headimgurl" label="头像地址:">
        <upload-pic :thumb="form.headimgurl" @update:thumb="form.headimgurl=$event" width="100" :append="true" cate_id="5"/>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" @click="changePwd('form')">确 定</el-button>
      <el-button type="warning" @click="onClose">取 消</el-button>
      
    </span>
  </div>
</template>
<script>
export default {
  computed:{
    model(){
      return this.$store.state.user.model
    }
  },
  data() {
    return {
      rules: {
        name: [{ required: true, message: "请输入昵称", trigger: "blur" }],
        nickname: [{ required: true, message: "请输入昵称", trigger: "blur" }],
      },
      form: {
        shop: {},
        role: {},
      },
    };
  },
  mounted(){
    this.get(`/${this.model}/${this.model}/info`, "POST").then(e => {
      this.form=e.info
    });
  },
  methods: {
    changePwd(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          this.get(`/${this.model}/${this.model}/pwd`, this.form, "POST").then(e => {
            this.$msg_ok("success", "修改成功");
            this.$store.commit('user/SET_INFO',e.info)
            this.onClose();
          });
        }
      });
    },
    onClose(){
      this.$emit('onClose')
    }
  }
};
</script>
>
